<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport"
	content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name='format-detection' content='telephone=no' />
<link rel="stylesheet" href="/assets/css/common.css" />
<link rel="stylesheet" href="/assets/css/iconfont/iconfont.css" />
<title>人车人</title><link rel="icon" href="/assets/img/titleico.ico" type="image/x-icon">
<style>
section .container .loginbox .inputbox input {
	height: 3.4rem;
	padding: .4rem 0;
	width: 100%;
	text-indent: 1rem;
}

section .container .loginbox .yzm {
	border-top: 1px solid #eaeaea;
	align-items: center;
}

section .container .loginbox .password {
	border-top: 1px solid #eaeaea;
	height: 0;
}

section .container .loginbox .password.hide {
	border: 0;
	overflow: hidden;
}
</style>
</head>
<body>
	<!-- header start -->
	#@loginHead("找回密码","
	<a href='/login'>登录</a>")
	<!-- end header -->
	<section id="login">
		<div class="container">
			<div class="logo">
<!-- 				<img src="/assets/img/logo.png" width="100%" title="人车人" alt="人车人" /> -->
			</div>
			<div class="loginbox">
				<form id="form">
					<div class="inputbox username">
						<input type="tel" id="username" name="username" placeholder="手机号" />
					</div>
					<div class="inputbox flexbox yzm">
						<input type="tel" id="yzm" name="yzm" class="flex"
							placeholder="验证码" /> <a href="javascript:;" id="getyzm"
							class="getyzm fail">获取验证码</a>
					</div>
					<div class="inputbox password trans hide">
						<input type="password" id="password" name="password"
							placeholder="新密码" />
					</div>
				</form>
			</div>
			<div class="btnbox">
				<a href="javascript:;" id="btn" class="login fail">完成</a>
			</div>
		</div>
	</section>

	<script src="/assets/js/fastclick.min.js"></script>
	<script src="/assets/js/jquery-3.1.1.min.js"></script>
	<script src="/assets/js/xxsg.js"></script>
	<script>
        $(document).ready(function(){
        	var getyzmFilter = false,
        		username = $("#username"),
        		password = $("#password"),
        		yzm = $("#yzm"),
        		isSubmit = false,
        		btnDom = $("#btn");
            $("#getyzm").on("click",function(){
            	if (getyzmFilter) {
					return false
				}
            	if (check1()) {
            		isSubmit = false;
            		var val = username.val();
            		console.log(val)
            		password.parent().removeClass("hide").height(password.parent()[0].scrollHeight);
            		//验证手机号
            		$.ajax({
            			type:"POST",
            			url:"/login/getForgetCode",
            			data:"username=" + val,
            			success:function(data){
            				//手机号存在
            				if(data.code=="2"){
            					isSubmit = true;
            					username.attr("readonly","readonly");
            					password.parent().removeClass("hide").height(password.parent()[0].scrollHeight);
            					getyzmFilter = true
            					var timeout = 120
            					var interval = setInterval(function(){
            						timeout--
            						$("#getyzm").html("获取验证码("+timeout+")")
            						if (timeout==0) {
            							$("#getyzm").html("获取验证码")
            							getyzmFilter = false
            							clearInterval(interval)
									}
            					}, 1000)
            				}else{
            					isSubmit = false;
            					_x.showTip(data.msg);
            					return false;
            				}
            			}
            		});
				}
            })
            btnDom.on("click",function(){
            	if (isSubmit && check2() && check3()) {
            		var form = $("#form")
            		var data = form.serialize();
            		$.ajax({
            			type: "POST",
                        url: "/login/resetPassWord",
                        data: data,
                        success: function(data){
                        	if (data.code=="1") {
								alert("修改密码成功！")
								location.href = "/login"
							}else{
								_x.showTip(data.msg);
							}
                        }
                    })
				}
            })
        
        
	        username.blur(check1);
            password.blur(check3);
            yzm.blur(check2);
            
            //密码判断
            function check3(){
            	var val = password.val();
				if (_x.isEmpty(val)) {
	        		_x.showTip("请输入密码！");
	        		btnDom.addClass("fail");
					return false
				}
				
				if (/\s/g.test(val)) {
					_x.showTip("请不要输入空格！");
					btnDom.addClass("fail");
					password.val("");
					return false
				}
				
				$("#btn").removeClass("fail");
				
				return true;
            }
	        
            //手机号判断
	        function check1(){      	
	        	$("#getyzm").removeClass("success");
				$("#getyzm").addClass("fail");
				
				var val = username.val();
				if (_x.isEmpty(val)) {
	        		_x.showTip("请输入手机号！");
					return false
				}
				
				if (val.length != 11 || /[^0-9]/.test(val)) {
					_x.showTip("手机号码无效！");
					return false
				}
				
				$("#getyzm").removeClass("fail")
				$("#getyzm").addClass("success")
	        	return true
	        }
            
            //验证码判断
	        function check2(){
            	var val = yzm.val();
	        	if (_x.isEmpty(val)) {
	        		_x.showTip("请输入验证码！");
					return false
				}
	        	
	        	if (/[^0-9]/.test(val) || val.length!=4) {
	        		_x.showTip("验证码输入有误！");
					return false
				}
	        	
	        	return true
	        }
        });
    </script>
</body>
</html>